<template>
  <el-input
    v-if="nm.javaType == 'String'"
    :disabled="disabled"
    :placeholder="nm.columnComment"
    v-model="localValue"
    @change="commonComponent"
  ></el-input>
  <a-input-number
    v-else-if="nm.javaType == 'double' || nm.javaType == 'BigDecimal' || nm.javaType == 'Long'"
    :disabled="disabled"
    :placeholder="nm.columnComment"
    v-model="localValue"
    @change="commonComponent"
  />
</template>

<script lang="ts" setup>
import { ref, watch, onMounted } from 'vue';

defineOptions({ name: 'NmInput' });

const props = defineProps({
  nm: {
    type: Object,
    required: true
  },
  value: {
    type: [String, Number],
    default: ''
  },
  disabled: {
    type: Boolean,
    default: false
  }
});

const emit = defineEmits(['update:value', 'commonComponent']);

const localValue = ref(props.value);

watch(() => props.value, (newValue) => {
  localValue.value = newValue;
});

const commonComponent = () => {
  console.log("NmInput localValue=", localValue.value);
  emit('update:value', localValue.value);
  emit('commonComponent', { ...props.nm, commonDataInfo: localValue.value });
};

onMounted(() => {
  console.log("NmInput onMounted props.value=", props.value);
  console.log("NmInput onMounted props.nm=", props.nm);
  localValue.value = props.value;
});
</script>

<style scoped>
</style>
